<template>
  <div :class="id === null ? 'app-container' : null">
    <el-tabs v-model="activeTab">
      <el-tab-pane :label="id ? '账号信息' : '回收数据'" name="recoveryData">
        <RecoveryInfo :id="id" @ok="submitForm"></RecoveryInfo>
      </el-tab-pane>
      <el-tab-pane label="其他开销" name="otherExpenses" v-if="id == null">
        <OtherExpenses v-if="activeTab == 'otherExpenses'"></OtherExpenses>
      </el-tab-pane>
      <el-tab-pane label="其他收入" name="otherIncome" v-if="id == null">
        <OtherIncome v-if="activeTab == 'otherIncome'"></OtherIncome>
      </el-tab-pane>
      <el-tab-pane label="账号详情" name="gameInfo" v-if="id">
        <GameInfo v-if="activeTab == 'gameInfo'" :id="id"></GameInfo>
      </el-tab-pane>
      <el-tab-pane label="三方对接" name="threeAccess" v-if="id">
        <ThreeAccess v-if="activeTab == 'threeAccess'" :id="id"></ThreeAccess>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import recoveryInfoApi from "@/api/zyl/recovery/recoveryInfo";
import gameListApi from "@/api/gameConfig/gameList";
import gameDictionaryApi from "@/api/gameConfig/gameDictionary";
import supplyConfigApi from "@/api/system/supplyConfig";
import RecoveryInfo from "./edit/info.vue";
import OtherExpenses from "@/views/zyl/expenses/add.vue";
import OtherIncome from "@/views/zyl/income/add.vue";
import GameInfo from "./edit/gameInfo.vue";
import ThreeAccess from "./edit/threeAccess.vue";

export default {
  name: "RecoveryInfoDetail",
  dicts: [
    "sys_inventory_status",
    "sys_recovery_search",
    "sys_yes_no",
    "sys_account_label",
    "sys_account_from",
    "sys_autoscreenshot_status",
    "sys_rebinding_type",
    "sys_client_type",
    "sys_contract_status",
    "sys_revier_status",
  ],
  props: {
    id: {
      type: Number,
      default: null,
    },
  },
  components: {
    RecoveryInfo,
    OtherExpenses,
    OtherIncome,
    GameInfo,
    ThreeAccess,
  },
  data() {
    return {
      // 遮罩层
      loading: true,
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 表单参数
      form: {},
      // 表单校验
      rules: {},
      gameList: [], // 游戏
      sysList: [], // 系统
      carrierList: [], //运营商列表
      areaList: [], //大区列表
      serverList: [], //服务器列表
      GameSelectedType: null, //游戏类型
      allUsers: [], //用户列表
      createTimeHover: false, //鼠标悬停创建时间上
      rebindingTimeHover: false, //鼠标悬停换绑时间上
      activeTab: "recoveryData",
    };
  },
  created() {
    this.getGameList();
    this.getAllUserList();
  },
  methods: {
    // 表单重置
    reset() {
      this.form = {
        id: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null,
        delFlag: null,
        remark: null,
        account: null,
        gameId: null,
        systemId: null,
        trading: null,
        recoveryChannel: null,
        accountNumber: null,
        accountPassword: null,
        recoveryPrice: null,
        clientType: null,
        payType: null,
        saleMoney: null,
        phone: null,
        changeUserId: null,
        name: null,
        numbers: null,
        cipher: null,
        nickName: null,
        isFriend: null,
        userId: null,
        contract: null,
        retrieve: null,
        payImg: null,
        antiAddictionImg: null,
        qqWalletImg: null,
        accountImg: null,
        descs: null,
        labelsId: null,
        rebindingTime: null,
        rebindingType: null,
      };
      this.resetForm("form");
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加回收账号";
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids;
      recoveryInfoApi.getRecoveryInfo(id).then((response) => {
        this.form = response.data;
        this.open = true;
        this.title = "修改回收账号";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.id != null) {
            recoveryInfoApi.updateRecoveryInfo(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            recoveryInfoApi.addRecoveryInfo(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    // 游戏列表
    getGameList() {
      gameListApi.getGameList().then((res) => {
        this.gameList = res.rows;
      });
    },
    selectGameType(val) {
      if (!val) {
        val = null;
        this.sysList = [];
        this.carrierList = [];
        this.areaList = [];
        return;
      }
      this.gameList.forEach((r) => {
        if (r.id == val) {
          this.GameSelectedType = r.type;
        }
      });
      if (this.GameSelectedType === 0) {
        // 手游
        // 获取系统列表和运营商列表
        this.getSysList();
        this.getYysList();
      } else {
        // 端游
        // 获取大区列表
        this.getAreaList2();
      }
    },
    // 获取系统列表
    getSysList() {
      gameDictionaryApi
        .getChildList({
          gameId: this.queryParams.gameId,
          systemKey: "system",
        })
        .then((res) => {
          this.sysList = res.rows;
        });
    },
    // 获取运营商列表
    getYysList() {
      gameDictionaryApi
        .getChildList({
          gameId: this.queryParams.gameId,
          systemKey: "carrier",
        })
        .then((res) => {
          this.carrierList = res.rows;
        });
    },
    // 运营商改变  获取大区列表
    getAreaList(e) {
      this.search();
      let obj = {
        gameId: this.queryParams.gameId,
        systemKey: "group",
      };
      this.queryParams.groupId = "";
      this.queryParams.serverId = "";

      // 运营商改变 找出选择的运营商的对象
      if (e) {
        this.carrierList.forEach((i) => {
          if (i.id == e) {
            obj.systemKey = i.systemKey + "group";
          }
        });
      }
      gameDictionaryApi.getChildList(obj).then((res) => {
        this.areaList = res.rows;
      });
    },
    // 大区改变  获取服务器列表
    getServiceList(e) {
      this.search();
      this.queryParams.serverId = "";

      if (e) {
        gameDictionaryApi
          .getList({
            parentId: e,
          })
          .then((res) => {
            this.serverList = res.rows;
          });
      } else {
        this.serverList = [];
      }
    },
    //端游 直接获取大区
    getAreaList2() {
      let obj = {
        gameId: this.queryParams.gameId,
        systemKey: "group",
      };
      gameDictionaryApi.getChildList(obj).then((res) => {
        this.areaList = res.rows;
      });
    },
    getAllUserList() {
      supplyConfigApi.getAllUserList().then((res) => {
        this.allUsers = res.rows;
      });
    },
  },
};
</script>

<style scoped lang="scss">
</style>
